<link rel="import" href="../bower_components/polymer/polymer.html">
<link rel="import" href="../bower_components/paper-menu/paper-menu.html">
<link rel="import" href="../bower_components/paper-menu/paper-submenu.html">
<link rel="import" href="../bower_components/paper-item/paper-item.html">
<link rel="import" href="../bower_components/paper-card/paper-card.html">
<link rel="import" href="../bower_components/iron-icon/iron-icon.html">
<link rel="import" href="../bower_components/paper-button/paper-button.html">
<link rel="import" href="../bower_components/iron-iconset-svg/iron-iconset-svg.html">

<dom-module id="left-menu">
    <style>
        :host {
            --app-primary-color: #4285f4;
            --app-secondary-color: black;
            font-size: 14px;
            color: #555;
            display: block;
            width: 280px;
            margin-right: 20px;
        }

        paper-menu {
            /*background-color: #EAEAEA;*/
        }

        paper-item {
            --paper-item: {
                cursor: pointer;
            };
            /*min-height: 24px;*/
        }

        .sublist paper-item {
            padding-left: 40px;
        }

        .item {
            font-weight: bold;
            color: #c0ca33;
            background-color: #ffffff;
        }

        iron-icon {
            padding-right: 10px;
        }

        .item iron-icon {
            padding-left: 30px;
        }

        paper-button {
            width: 100%;
            justify-content: flex-start;
            margin: 0px;
            border-color: #c0ca33;
            border-radius: 0px;
        }

        .bottom-border-div {
            padding-bottom: 1px;
            background-color: #c0ca33;
        }

        .series-div {
            font-size: 16px;
            font-weight: bold;
            background-color: #c0ca33;
            color: #ffffff;
        }
    </style>
    <template>
        <paper-card style="width: 100%;border-color: #ef6c00">

            <div style="font-size: 20px;font-weight: bold;background-color: #ef6c00;color: #ffffff">
                <paper-button>
                    <iron-icon icon="stars"></iron-icon>
                    设备分类
                </paper-button>
            </div>

            <!-- 朗格系列 start -->
            <div class="series-div">
                <paper-button>
                    <iron-icon icon="arrow-downward"></iron-icon>
                    朗格系列
                </paper-button>
            </div>
            <div class="bottom-border-div">
                <div class="item">
                    <paper-button>
                        <iron-icon icon="chevron-right"></iron-icon>
                        朗格1800吨
                    </paper-button>
                </div>
            </div>
            <div class="bottom-border-div">
                <div class="item">
                    <paper-button>
                        <iron-icon icon="chevron-right"></iron-icon>
                        朗格1300吨
                    </paper-button>
                </div>
            </div>
            <div class="bottom-border-div">
                <div class="item">
                    <paper-button>
                        <iron-icon icon="chevron-right"></iron-icon>
                        朗格1100吨
                    </paper-button>
                </div>
            </div>
            <div class="bottom-border-div">
                <div class="item">
                    <paper-button>
                        <iron-icon icon="chevron-right"></iron-icon>
                        朗格800吨
                    </paper-button>
                </div>
            </div>
            <div class="bottom-border-div">
                <div class="item">
                    <paper-button>
                        <iron-icon icon="chevron-right"></iron-icon>
                        朗格650吨
                    </paper-button>
                </div>
            </div>
            <div class="bottom-border-div">
                <div class="item">
                    <paper-button>
                        <iron-icon icon="chevron-right"></iron-icon>
                        朗格500吨
                    </paper-button>
                </div>
            </div>
            <div class="bottom-border-div">
                <div class="item">
                    <paper-button>
                        <iron-icon icon="chevron-right"></iron-icon>
                        朗格400吨
                    </paper-button>
                </div>
            </div>
            <div class="bottom-border-div">
                <div class="item">
                    <paper-button>
                        <iron-icon icon="chevron-right"></iron-icon>
                        朗格360吨
                    </paper-button>
                </div>
            </div>
            <div class="bottom-border-div">
                <div class="item">
                    <paper-button>
                        <iron-icon icon="chevron-right"></iron-icon>
                        朗格250吨高速机
                    </paper-button>
                </div>
            </div>
            <div class="bottom-border-div">
                <div class="item">
                    <paper-button>
                        <iron-icon icon="chevron-right"></iron-icon>
                        朗格250吨
                    </paper-button>
                </div>
            </div>
            <div class="bottom-border-div">
                <div class="item">
                    <paper-button>
                        <iron-icon icon="chevron-right"></iron-icon>
                        朗格210吨高速机
                    </paper-button>
                </div>
            </div>
            <div class="bottom-border-div">
                <div class="item">
                    <paper-button>
                        <iron-icon icon="chevron-right"></iron-icon>
                        朗格160吨
                    </paper-button>
                </div>
            </div>
            <div class="bottom-border-div">
                <div class="item">
                    <paper-button>
                        <iron-icon icon="chevron-right"></iron-icon>
                        朗格160吨高速机
                    </paper-button>
                </div>
            </div>
            <div class="bottom-border-div">
                <div class="item">
                    <paper-button>
                        <iron-icon icon="chevron-right"></iron-icon>
                        朗格130吨
                    </paper-button>
                </div>
            </div>
            <div class="bottom-border-div">
                <div class="item">
                    <paper-button>
                        <iron-icon icon="chevron-right"></iron-icon>
                        朗格130吨高速机
                    </paper-button>
                </div>
            </div>
            <!-- 朗格系列 end -->

            <!--  川口系列 start -->
            <div class="series-div">
                <paper-button>
                    <iron-icon icon="arrow-downward"></iron-icon>
                    川口系列
                </paper-button>
            </div>
            <div class="bottom-border-div">
                <div class="item">
                    <paper-button>
                        <iron-icon icon="chevron-right"></iron-icon>
                        川口360吨
                    </paper-button>
                </div>
            </div>
            <div class="bottom-border-div">
                <div class="item">
                    <paper-button>
                        <iron-icon icon="chevron-right"></iron-icon>
                        川口300吨
                    </paper-button>
                </div>
            </div>
            <!--  川口系列 end -->

            <!--  海天平衡 start -->
            <div class="series-div">
                <paper-button>
                    <iron-icon icon="arrow-downward"></iron-icon>
                    海天平衡系列
                </paper-button>
            </div>
            <div class="bottom-border-div">
                <div class="item">
                    <paper-button>
                        <iron-icon icon="chevron-right"></iron-icon>
                        海天250吨双色机
                    </paper-button>
                </div>
            </div>
            <!--  海天平衡 end -->

        </paper-card>

    </template>

    <script>
        Polymer({
            is: 'left-menu',

        });
    </script>
</dom-module>